<template>
    <h2>会员等级修改页面</h2>
    <table border="1">
        <tr>
            <td>等级名称</td>
            <td>
                <input type="text" v-model="rank.MR_Name"/>
            </td>
        </tr>
        <tr>
            <td>等级状态</td>
            <td>
                <input type="radio" name="state" value="启用" v-model="rank.MR_State"/>启用
                <input type="radio" name="state" value="禁用" v-model="rank.MR_State"/>禁用
            </td>
        </tr>
        <tr>
            <td>最大成长值</td>
            <td>
                <input type="text" v-model="rank.MR_MaxPoint"/>
            </td>
        </tr>
        <tr>
            <td>最小成长值</td>
            <td>
                <input type="text" v-model="rank.MR_MinPoint"/>
            </td>
        </tr>
        <tr>
            <td></td>
            <td>
                <input type="button" value="修改等级" @click="editRank"/>
            </td>
        </tr>
    </table>
</template>

<script setup lang="ts">
import {ref,onMounted} from 'vue'
    import {useRouter} from 'vue-router'
    const router=useRouter();
    import axios from 'axios'
    const rank=ref({
      "MR_Id": 0,
      "MR_Name": "",
      "MR_State": "",
      "MR_MaxPoint": "",
      "MR_MinPoint": ""
    })
    const params=new URLSearchParams(location.search);
    const MRId=params.get('MRId');
    onMounted(()=>{
        axios.get('https://localhost:44320/api/Member/RankBack',{
            params:{
                MRid:MRId
            }
        })
        .then(res=>{
            rank.value=res.data;
        })
    })
    const editRank=()=>{
        axios.put('https://localhost:44320/api/Member/RankEdit',{
            "MR_Id": MRId,
      "MR_Name": rank.value.MR_Name,
      "MR_State": rank.value.MR_State,
      "MR_MaxPoint": rank.value.MR_MaxPoint,
      "MR_MinPoint": rank.value.MR_MinPoint
        })
        .then(res=>{
            if(res.data>0)
            {
                alert('修改成功');
                router.push('/showRank');
            }
            else
            {
                alert('修改失败');
            }
        })
    }
</script>